<template>
  <div class="body" :style="{height: height + 'px'}">
    <Header :title="title"></Header>
     <div class="wx_code aui-bg-f">
          <div class="aui-text-center aui-padded-10 aui-ftn16" style="color: #c00">手机网页端:m.jikeshiyong.cn</div>
          <div class="image_out">
              <img :src="rwm" alt="" @click="fnPreview()">
          </div>
          <!-- <div class="text aui-text-6 aui-ftn16 aui-text-center">关注公众号，获得更多资讯</div> -->
          <div class="aui-btn aui-btn-danger aui-ftn16 aui-btn-block" style="width: 120px;height: 36px;line-height: 36px;margin: 20px auto" @click="fnPreview()">保存图片</div>
      </div>
  </div>
</template>
<script>
  import Header from '../components/header.vue'
  export default {
    data () {
      return {
        rwm: '',
        title: '手机网页端',
        height: 0
      }
    },
    components: {
      Header
    },
    mounted() {
      this.height = document.documentElement.clientHeight;
      this.rwm = this.utils.ossUrl+'/uploads/image/jksy_wx.jpg'
    },
    methods: {
      fnPreview: function() {
        this.utils.fnPreviewPic([this.rwm])
      },
      fnStateWeb () {
        location.href = 'https://m.jikeshiyong.cn/'
      }
    }
  }
</script>

<style scoped>
  .body {
    width: 100%;
    height: 100%;
    background-color: var(--pink)!important;
  }
div.wx_code {
    margin: 60px 20px 0 20px;
    padding: 40px;
    border-radius: 10px;
}
div.wx_code div.image_out {
    padding: 16px;
    border: 2px solid var(--pink);
    border-radius: 5px;
}
div.wx_code div.image_out img {
  width: 100%;
}
div.wx_code div.text {
    padding: 20px 0 28px 0;
}
</style>
